<template>
  <div>
    <el-breadcrumb separator="/">
      <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
      <el-breadcrumb-item>账单分析</el-breadcrumb-item>
      <el-breadcrumb-item><a href="#/budget">预算结余</a></el-breadcrumb-item>
    </el-breadcrumb>

    <el-card>
      <!-- 查询当月预算信息 -->
      <el-row :gutter="20">
        <el-col :span="5">
          <el-date-picker
            v-model="iTime"
            type="month"
            placeholder="选择月"
            @change="getBudget"
          >
          </el-date-picker>
        </el-col>
      </el-row>
    </el-card>

    <el-table :data="tableData" style="width: 100%">
      <el-table-column
        prop="date"
        label="日期"
        width="180">
      </el-table-column>
      <el-table-column
        prop="name"
        label="姓名"
        width="180">
      </el-table-column>
      <el-table-column
        prop="address"
        label="地址">
      </el-table-column>
    </el-table>
  </div>
</template>
<script>
export default {
  data() {
    return {
      iTime: null
    }
  },
  methods: {
    // 格式化日期
    dateFormat(originVal) {
      const dt = new Date(originVal)
      const y = dt.getFullYear()
      const m = (dt.getMonth() + 1 + '').padStart(2, '0')
      return `${y}-${m}`
    },
    getBudget() {

    }
  }
}
</script>
<style lang="less" scoped></style>
